// custom-tab-bar/index.js
import { storeBindingsBehavior } from 'mobx-miniprogram-bindings'
import { store } from '../../store/store'

Component({

  // 将 storeBindingsBehavior 和 behaviors 进行绑定
  // 绑定以后，就实现了 store 和 组件数据的合并
  behaviors: [storeBindingsBehavior],

  storeBindings: {
    store,
    fields: {
      sum: 'sum',
      activeValue: 'activeValue'
    },
    actions: {
      changeActive: 'changeActive'
    }
  },

  options: {
    styleIsolation: "shared"
  },

  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    // active: 0,
    list: [
      {
        pagePath: "/pages/home/home",
        text: "主页",
        iconPath: "/assets/tabs/home.png",
        selectedIconPath: "/assets/tabs/home-active.png"
      },
      {
        pagePath: "/pages/message/message",
        text: "消息",
        iconPath: "/assets/tabs/message.png",
        selectedIconPath: "/assets/tabs/message-active.png",
        info: 3
      },
      {
        pagePath: "/pages/contact/contact",
        text: "联系我们",
        iconPath: "/assets/tabs/contact.png",
        selectedIconPath: "/assets/tabs/contact-active.png"
      }
    ]
  },

  observers: {
    sum: function (newSum) {
      this.setData({
        'list[1].info': newSum
      })
    }
  },

  /**
   * 组件的方法列表
   */
  methods: {
    onChange(event) {
      // event.detail 的值为当前选中项的索引
      // this.setData({ activeValue: event.detail });
      this.changeActive(event.detail)
      
      wx.switchTab({
        url: this.data.list[event.detail].pagePath
      })
    }
  }
})
